<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title>会话存档/配置</title>
	<link rel="stylesheet" href="/layui/css/layui.css">
	<style type="text/css">
		body{
			background: #e9e9e9;
		}
		/*公共头部带搜索*/
		.public_container{
			margin: 20px;
			background: #fff;
		}
		.public_title_container{
			height: 54px;
			padding: 0 20px;
			font-size: 14px;
			display: flex;
			align-items: center;
			background: #f9f9f9;
			border-bottom: 1px solid #f0f0f0;
		}
		/*公共表单部分*/
		.public_form_container{
			padding: 20px 20px 40px 20px;
		}
		.public_form_content{
			padding: 24px 40px 24px 0;
			background: #fafafa;
			border: 1px solid #e9e9e9;
			margin-bottom: 8px;
		}
		.public_form_List{
			margin-bottom: 10px;
		}
		.public_form_List:last-child{
			margin-bottom: 0px;
		}
		.public_formTitle_container lable{
			font-size: 13px;
			font-weight: bold;
		}
		.public_secendTitle_container{
			background: #fafafa;
			border: 1px solid #e9e9e9;
			border-bottom: none;
			/*margin: 20px 20px 0 20px;*/
		}
		.public_secendTitle_container h2{
			padding: 16px 20px;
			color: rgba(0,0,0,.85);
			font-weight: 700;
			font-size: 14px;
		}
	</style>
</head>
<body>
	<form class="layui-form" id="form1">
		

		<div class="public_container">
			<!-- /*公共头部带搜索*/ -->
			<div class="public_content">
				<div class="public_title_container">
					<p>配置</p>
				</div>

			</div>
			<!-- /*公共头部带搜索*/ end -->
			<!-- 公共表单部分 -->
			
			<div class="public_form_container">
				<div class="public_secendTitle_container">
					<h2>复制以下信息并填入到企业微信后台</h2>
				</div>
				<div class="public_form_content">
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">可信IP地址</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block " style="max-width: 540px; padding-top: 10px;">
								<!--{GetHostByName($_SERVER['SERVER_NAME'])}-->106.14.242.230
								<a style="color:#387cdf;" href="javascript:void(0);" onclick="copyToClip('47.99.95.180')">复制</a>
							</div>
						</div>
					</div>
				</div>		
				<div class="public_secendTitle_container">
					<h2>公钥填入企业微信后台私钥填入下框中</h2>
				</div>
				<div class="public_form_content">
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">私钥</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block" style="max-width: 540px; padding-top: 10px;">
								<textarea name="privateKey" value="{$config->privateKey}" lay-verify="required" placeholder="请输入内容" class="layui-textarea">{$config->privateKey}</textarea>
							</div>
						</div>
					</div>
				</div>
				<div class="public_secendTitle_container">
					<h2>将企业微信后台会话存档配置页面的Secret复制粘贴到下框中</h2>
				</div>
				<div class="public_form_content">
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">存档Secret</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
								<input type="text" name="secret" value="{$config->secret}" lay-verify="required" placeholder="请输入会话存档Secret" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">公钥版本号</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
								<input type="text" name="publicKeyVer" value="{$config->publicKeyVer}"  lay-verify="required" placeholder="请输入公钥版本号" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
				</div>
				<div class="public_form_content">
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">会话存档状态</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  <input type="checkbox" name="status" lay-skin="switch" {if $config->status == 1}checked{/if}>
							</div>
						</div>
					</div>
				</div>
				<div class="public_form_content">
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">存储服务状态</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  <input type="checkbox" name="ossStatus" lay-skin="switch" lay-filter="ossStatus" {if $config->os_status == 1}checked{/if}>
							</div>
						</div>
					</div>
				</div>
				<div class="public_form_content oss_server" {if $config->os_status == 0} style="display: none;"{/if}>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label" style="width: 85px;">选择存储对象:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input class="part-time-form-elem" type="radio" lay-filter="osType" name="os_type" value="1" title="阿里云OOS"  {if !$data || $data['os_type'] == 1}checked {/if}>
								<input class="part-time-form-elem" type="radio" lay-filter="osType" name="os_type" value="2" title="腾讯云COS" {if $data['os_type'] == 2}checked {/if}>
								<input class="part-time-form-elem" type="radio" lay-filter="osType" name="os_type" value="3" title="七牛云QNOS" {if $data['os_type'] == 3}checked {/if}>
							</div>
						</div>
					</div>
				</div>
				<div class="public_form_content oss_server os_aliyun" {if $config->os_status == 0 || $data['os_type'] != 1} style="display: none;"{/if}>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">AccessKeyId:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="oss_accesskeyid" value="{$data['oss_accesskeyid']}"  placeholder="AccessKeyId" autocomplete="off" class="layui-input">
							
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">AccessKeySecret:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="oss_accesskeysecret" value="{$data['oss_accesskeysecret']}"  placeholder="AccessKeySecret" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">Endpoint:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="oss_endpoint" value="{$data['oss_endpoint']}"  placeholder="Endpoint" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">BucketName:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="oss_bucketname" value="{$data['oss_bucketname']}"  placeholder="BucketName" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
				</div>
				<div class="public_form_content oss_server os_tengxunyun" {if $config->os_status == 0 || $data['os_type'] != 2} style="display: none;"{/if}>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">SecretId:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="cos_secretid" value="{$data['cos_secretid']}"  placeholder="SecretId" autocomplete="off" class="layui-input">
							
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">SecretKey:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="cos_secretkey" value="{$data['cos_secretkey']}"  placeholder="SecretKey" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">Endpoint:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="cos_endpoint" value="{$data['cos_endpoint']}"  placeholder="Endpoint" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">BucketName:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="cos_bucketname" value="{$data['cos_bucketname']}"  placeholder="BucketName" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
				</div>
				<div class="public_form_content oss_server os_qiniuyun" {if $config->os_status == 0 || $data['os_type'] != 3} style="display: none;"{/if}>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">Access Key:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="qiniu_accesskey" value="{$data['qiniu_accesskey']}"  placeholder="Access Key" autocomplete="off" class="layui-input">
							
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">Secret Key:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="qiniu_secretkey" value="{$data['qiniu_secretkey']}"  placeholder="Secret Key" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">Domain:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="qiniu_domain" value="{$data['qiniu_domain']}"  placeholder="Domain" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					<div class="public_form_List">
						<div class="public_formTitle_container">
							<lable class="layui-form-label">BucketName:</lable>
						</div>
						<div class="public_formOther_container">
							<div class="layui-input-block">
							  	<input type="text" name="qiniu_bucketname" value="{$data['qiniu_bucketname']}"  placeholder="BucketName" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
				</div>
					
				<div class="layui-form-item">
					<div class="layui-input-block">
						<a class="layui-btn" lay-submit lay-filter="formDemo">立即提交</a>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
			</div>
			<!-- 公共表单部分 end-->
		</div>
	</form>
	<script src="/cdn/jquery.js"></script>
	<script src="/layui/layui.js"></script>
	<script src="/js/ajax.js"></script>
	<script type="text/javascript">
		// 表单
		layui.use(['form','layer'], function(){
			var form = layui.form;
			var layer = layui.layer;

		  //监听提交
		  form.on('submit(formDemo)', function(data){
		    //alert(JSON.stringify(data.field));
		    //return false;
		    console.log(data)
		    if(data.field.ossStatus){
		    	if(data.field.os_type == 1){
		    		if(!data.field.oss_accesskeyid || !data.field.oss_accesskeysecret || !data.field.oss_bucketname || !data.field.oss_endpoint){
		    			tusi('阿里云对象存储参数必填');
		    			return false;
		    		}
		    	}else if(data.field.os_type == 2){
		    		if(!data.field.cos_secretid || !data.field.cos_secretkey || !data.field.cos_endpoint || !data.field.cos_bucketname){
		    			tusi('腾讯云对象存储参数必填');
		    			return false;
		    		}
		    	}else if(data.field.os_type == 3){
		    		if(!data.field.qiniu_accesskey || !data.field.qiniu_bucketname || !data.field.qiniu_domain || !data.field.qiniu_secretkey){
		    			tusi('七牛云对象存储参数必填');
		    			return false;
		    		}
		    	}
		    }
			var formData = $('#form1').serialize();	
			myAjaxPost(false, true, '', formData, function (resp) {
				if (resp.status == 'success') {
					tusi(resp.msg);
					setTimeout(function(){
						location.href = 'chat_data.html'; 
					},2000);
				}else{
					alert(resp.msg);
				}
			});
		  });

		  //监听oss状态
		  form.on('switch(ossStatus)',function(ost){

		  	if(ost.elem.checked){
		  		$(".oss_server").show()
		  		let os_type = $('input[name="os_type"]:checked').val(); 
		  		if(os_type == 1){
		  			$(".os_tengxunyun").hide()
		  			$(".os_qiniuyun").hide()

		  		}else if(os_type == 2){
		  			$(".os_qiniuyun").hide()
		  			$(".os_aliyun").hide()
		  		}else if(os_type == 3){
		  			$(".os_tengxunyun").hide()
		  			$(".os_aliyun").hide()

		  		} 
		  	}else{
		  		$(".oss_server").hide()
		  	}
		  })

		  //监听选者对象存储服务
		  form.on('radio(osType)',function(ot){
		  	 let os_type = ot.value; 
		  	 console.log(os_type)
		  	 if(os_type == 1){
		  	 	$(".os_aliyun").show()
	  			$(".os_tengxunyun").hide()
	  			$(".os_qiniuyun").hide()
	  		  }else if(os_type == 2){
	  			$(".os_tengxunyun").show()
	  			$(".os_qiniuyun").hide()
	  			$(".os_aliyun").hide()
	  		  }else if(os_type == 3){
	  		  	$(".os_qiniuyun").show()
	  			$(".os_tengxunyun").hide()
	  			$(".os_aliyun").hide()
	  		 } 
		  })

		});
	</script>
	<script type="text/javascript">
		function copyToClip(content, message) {
			var aux = document.createElement("input"); 
			aux.setAttribute("value", content); 
			document.body.appendChild(aux); 
			aux.select();
			document.execCommand("copy"); 
			document.body.removeChild(aux);
			if (message == null) {
				layer.msg("复制成功");
			} else{
				layer.msg(message);
			}
		}
	</script>
</body>
</html>